<template>
    <el-container>
      <el-aside width="200px">
        <br><br><br><br>
        <el-col :span="24">
          <el-menu default-active="2" class="el-menu-vertical-demo" background-color="white">
            <el-submenu index="1">
              <template slot="title">
                <i class="el-icon-phone"></i>
                <span style="color:black">门诊部</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="1-1" style="color:blueviolet">
                  <router-link to="/seeadoctor">就诊</router-link>
                </el-menu-item>
                <el-menu-item index="1-2" style="color:blueviolet">
                  <router-link to="/prescription">处方</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title">
                <i class="el-icon-user"></i>
                <span style="color:black">住院部</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="3-1" style="color:blueviolet">
                  <router-link to="/In_qu">
                  住院办理
                </router-link>
                  </el-menu-item>
                <el-menu-item index="3-2" style="color:blueviolet">
                  <router-link to="/in_pa_qu">
                  住院信息
                </router-link>
                  </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="3">
              <template slot="title">
                <i class="el-icon-s-finance"></i>
                <span style="color:black">财务部</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="3-1" style="color:blueviolet">
                  <router-link to="/Asset">报表</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="4">
              <template slot="title">
                <i class="el-icon-s-shop"></i>
                <span style="color:black">药品部</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="4-1" style="color:blueviolet">
                  <router-link to="/Medicion">药房</router-link>
                </el-menu-item>
                <el-menu-item index="4-2" style="color:blueviolet">
                  <router-link to="/Medbuy">仓库</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>

            <el-submenu index="5">
              <template slot="title">
                <i class="el-icon-s-shop"></i>
                <span style="color:black">人员管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="5-1" style="color:blueviolet">
                  <router-link to="/docter">医生信息</router-link></el-menu-item>
                <el-menu-item index="5-2" style="color:blueviolet">
                  <router-link to="/nurse">护士信息</router-link>
                </el-menu-item>
                <el-menu-item index="5-3" style="color:blueviolet">
                  <router-link to="/account">账户信息</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>

            <el-submenu index="6">
              <template slot="title">
                <i class="el-icon-circle-plus"></i>
                <span style="color:black">就诊管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="6-1" style="color:blueviolet">挂号信息</el-menu-item>
                <el-menu-item index="6-2" style="color:blueviolet">
                  <router-link to="/medsci">就诊记录</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="7">
              <template slot="title">
                <i class="el-icon-thumb"></i>
                <span style="color:black">挂号处</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="7-1" style="color:blueviolet">
                  <router-link to="/registerid">挂号登记</router-link>
                </el-menu-item>
                <el-menu-item index="7-2" style="color:blueviolet">
                  <router-link to="/registersel">挂号查询</router-link>
                </el-menu-item>
                <el-menu-item index="7-3" style="color:blueviolet">
                  <router-link to="/count">挂号统计</router-link>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
          </el-menu>
        </el-col>
      </el-aside>
      <el-container>
        <el-header>
      <el-col :span="18"><h2 style="color:wheat">华康医疗管理系统</h2></el-col>
      <el-col :span="6">欢迎{{ loginAccount.aname }}，<el-link type="danger" @click="logout()">退出系统</el-link></el-col>
    </el-header>
        <el-main>
          <router-view />
        </el-main>
        <el-footer>
          最终解释权归华康医疗小组成员所有
        </el-footer>
      </el-container>
    </el-container>
</template>
<style>
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}

* {
  margin: 0;
  padding: 0;
}

.el-header,
.el-footer {
  background-color:rgb(97, 183, 244);
  color: #333;
  text-align: center;
  line-height: 60px;
}

.el-aside {
  background-color: white;
  color: #333;
  text-align: center;
  height: 700px;
}

.el-main {
  
  color: #f1d8d8;
  text-align: center;
  height: 650px;
}

body>.el-container {
  margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}
</style>
<script>
export default {
  data() {
    return {
      isCollapse: true,
      loginAccount:{}
    };
  },
  methods: {
    logout() {
      this.$axios.get("auth/logout")
        .then((result) => {
          let vo = result.data;
          this.$message(vo.message);
          if (vo.code == 200) {
            localStorage.removeItem("loginAccount");
            // 切换路由组件
            this.$router.push("/login");
          }
        }).catch((err) => {
          console.log(err);
        });
    }
  },
  mounted() {
    let userStr = localStorage.getItem("loginAccount");
    this.loginAccount = JSON.parse(userStr);
  }
}
</script>